<%--
  Created by IntelliJ IDEA.
  User: 13935999517
  Date: 2023/12/25
  Time: 11:21
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <style>
        .footer {
            display: flex;
            justify-content: center;
            align-items: center;
        }

        input {
            width: 50%;
        }

        .one {
            width: 999px;
            height: 300px;
            border: 1px solid black;
            margin-left: 205px;
            margin-top: -16px;
            display: none;
            position: absolute;
            z-index: 1;
            background-color: white
        }

        .two {
            position: relative;
            z-index: 0;
            left: 0;
            top: 0;
        }

        .box-body {
            position: absolute;
        }

        .three {
            margin-left: 1150px;
            border-radius: 5px;
            position: relative;
            top: 400px;
        }

    </style>
</head>
<body>
<div class="skin-default" id="wrapper">
    <%@include file="/static/pages/head/header.jsp" %>
    <div class="page-wrapper">
        <div class="page-header">
            <h1 class="title">
                产废操作
            </h1>
        </div>
        <section class="page-body">
            <div class="row widget">
                <section class="col-md-12">
                    <div class="box table">
                        <div class="box-body">
                            <p></p>
                            <form class="form-horizontal" title="form">
                                <input type="hidden" name="wasteId" value="${waste.wasteId}">
                                <div class="form-group">
                                    <label class="col-sm-2 control-label">请输入产废类型:</label>
                                    <div class="col-sm-10">
                                        <input type="text" class="form-control" placeholder="请输入废物类型"
                                               title="typeId"/>
                                    </div>
                                </div>
                                <div class="one">

                                </div>
                                <div class="two">
                                    <div class="form-group">
                                        <label class="col-sm-2 control-label">产废编码:</label>
                                        <div class="col-sm-10">
                                            <input type="text" class="form-control" name="wasteCode"
                                                   value="${waste.wasteCode}">
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label class="col-sm-2 control-label">产废来源:</label>
                                        <div class="col-sm-10">
                                            <input type="text" class="form-control" name="wasteSource"
                                                   value="${waste.wasteSource}">
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label class="col-sm-2 control-label">危险废物:</label>
                                        <div class="col-sm-10">
                                            <input type="text" class="form-control" name="wasteHazardous"
                                                   value="${waste.wasteHazardous}">
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label class="col-sm-2 control-label">行业俗称:</label>
                                        <div class="col-sm-10">
                                            <input type="text" class="form-control" name="wasteCommonname"
                                                   value="${waste.wasteCommonname}">
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label class="col-sm-2 control-label">危险类别:</label>
                                        <div class="col-sm-10">
                                            <input type="text" class="form-control" name="typeId"
                                                   value="${waste.typeId}">
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label class="col-sm-2 control-label">生产量:</label>
                                        <div class="col-sm-10">
                                            <input type="text" class="form-control" placeholder="请输入产生量"
                                                   name="productNum">
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label class="col-sm-2 control-label">生产单位:</label>
                                        <select name="productUnit" class="form-control" style="width: 400px">
                                            <option value="-1">请选择</option>
                                            <option value="g">克</option>
                                            <option value="kg">千克</option>
                                            <option value="t">吨</option>
                                        </select>
                                    </div>
                                    <div class="form-group">
                                        <label class="col-sm-2 control-label">选择容器:</label>
                                        <select class="form-control" style="width: 400px" name="containerId">
                                            <option value="-1">请选择</option>
                                            <c:forEach items="${containerList}" var="con">
                                                <option value="${con.containerId}">最大容量:${con.containerMaxvolume}
                                                    单位:${con.containerUnit}</option>
                                            </c:forEach>
                                        </select>
                                    </div>
                                </div>
                                <button type="button" class="btn btn-success three"
                                        style="position: relative;top: 10px">确认
                                </button>
                            </form>
                        </div>
                    </div>
                </section>
            </div>
        </section>
    </div>
</div>
</body>
<script>
    $(function () {

    })

    $("[title='typeId']").keydown(function () {
        $(".one").css("display", "block");
    })
    $("[title='typeId']").keydown(function () {
        $(".one").children().remove();
        var typeId = $(this).val();
        $.ajax({
            type: "GET",
            url: "${pageContext.request.contextPath}/product/list/" + typeId,
            dataType: "json",
            success: function (waste) {
                $(waste).each(function (i, v) {
                    $text = $("<a href='${pageContext.request.contextPath}/product/query/" + v.wasteId + "'>" + v.typeId + "\t" + v.wasteCode + "\t" + v.wasteName + "\t" + v.wasteHazardous + "\t" + v.wasteSource + "\t" + v.wasteCharacteristics + "</a></br>")
                    $(".one").append($text);
                })
            }
        })
    })

    $("[title='typeId']").keyup(function () {
        $(".one").children().remove();
        var typeId = $(this).val();
        $.ajax({
            type: "GET",
            url: "${pageContext.request.contextPath}/product/list/" + typeId,
            dataType: "json",
            success: function (waste) {
                $(waste).each(function (i, v) {
                    $text = $("<a href='${pageContext.request.contextPath}/product/query/" + v.wasteId + "'>" + v.typeId + "\t" + v.wasteCode + "\t" + v.wasteName + "\t" + v.wasteHazardous + "\t" + v.wasteSource + "\t" + v.wasteCharacteristics + "</a></br>")
                    $(".one").append($text);
                })
            }
        })
    })


    $("[type='button']").click(function () {
        var wasteId = $("[name='wasteId']").val();
        var typeId = $("[name='typeId']").val();
        var wasteCode = $("[name='wasteCode']").val();
        var wasteSource = $("[name='wasteSource']").val();
        var wasteHazardous = $("[name='wasteHazardous']").val();
        var wasteCommonname = $("[name='wasteCommonname']").val();
        var productNum = $("[name='productNum']").val();
        var productUnit = $("[name='productUnit']").val();
        var containerId = $("[name='containerId']").val();
        $.ajax({
            type: "post",
            url: "${pageContext.request.contextPath}/product/add",
            data: {
                wasteId: wasteId,
                typeId: typeId,
                wasteCode: wasteCode,
                wasteSource: wasteSource,
                wasteHazardous: wasteHazardous,
                wasteCommonname: wasteCommonname,
                productNum: productNum,
                productUnit: productUnit,
                containerId: containerId
            },
            success: function (res) {
                alert(res.msg)
            }
        })
        $("[title='form'] :input").val("");//清空表单
    })

    $("[name='containerId']").change(function () {
        var conId = $(this).find("option:selected").val();
        var unit = $("[name='productUnit']").find("option:selected").val();//所选单位
        var num = $("[name='productNum']").val();//输入的数量
        $.ajax({
            type: "get",
            url: "${pageContext.request.contextPath}/product/findById/" + conId,
            dataType: "json",
            success: function (res) {
                //判断单位是否一致
                if (res.data.containerUnit == unit) {
                    //输入的数量是否大于容器的剩余存储量
                    if (num > (res.data.containerMaxvolume - res.data.containerRealvolume)) {
                        alert("容器容量不够了,请重新选择")
                    } else {

                    }
                } else {
                    alert("单位必须一致")
                }
            }
        })
    })


</script>
</html>
